<template>
    <div>
       
    </div>
</template>



<script setup>
import { customRef, ref,reactive, isReactive, shallowReactive, isProxy, readonly, shallowReadonly, isReadonly } from 'vue';


//1.isReactive()
const state=reactive({count:10})
console.log(isReactive(state));

const shallowState=shallowReactive({count:10,val:{num:10}})
console.log(isReactive(shallowState));
console.log(isReactive(shallowState.val));//shallowReactive声明的对象只会对根属性做响应式

// 2，isProxy()
const reactiveObj=reactive({count:10})
console.log(isProxy(reactiveObj));

const readonlyObj=readonly({count:10})
console.log(isProxy(readonlyObj));

const shallowReactiveObj=shallowReactive({count:10})
console.log(isProxy(shallowReactiveObj));

const shallowReadonlyObj=shallowReadonly({count:10})
console.log(isProxy(shallowReadonlyObj));



//3.isReadonly()
console.log(isReadonly(readonlyObj));

const shallowReadonlyObj1=shallowReadonly({count:10,val:{num:10}})
console.log(isReadonly(shallowReadonlyObj1));
console.log(isReadonly(shallowReadonlyObj1.val));//shallowReadonly声明的对象只会对根属性做响应式

</script>



<style scoped></style>